<template>
	<div>
    <div id="check">
      <div class="check-container">
        <div v-if="isCurrentVersion" class="watermark"><img class="watermark-img" src="@/assets/img/watermark.jpg" /></div>
        <div class="content">
          <div style="height: 50px"></div>
          <div class="check-box">
            <div class="page-header1">
              <table border="1">
                <tr>
                	<td class="w-450 h-100">
                    <el-row>
                      <el-col :span="10" :offset="2">
                        <img src="@/assets/img/logoNew.png" style="height: 70px" />
                      </el-col>
                      <el-col :span="11" :offset="1">
                        <b style="font-size: 35px;line-height: 2;">成都倍特</b>
                      </el-col>
                    </el-row>
                  </td>
                  <td colspan="2" class="w-450 h-100 text-center">进厂物料请检单</td>
                </tr>
                <tr>
                	<td class="w-450 h-30"><div class="m-l-5">记录编号 No: CW/SMP·002-R01</div></td>
                  <td class="w-225 h-30"><div class="m-l-5">版本号 Version: 03</div></td>
                  <td class="w-225 h-30"><div class="m-l-5">页码 Page: 1/1</div></td>
                </tr>
              </table>
            </div>
            <div class="page-main" id="main-body">
              <table border="1">
                <tr>
                	<td class="w-100 h-35"><div class="m-l-5">物料名称</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ checkList.productName }}</div></td>
                  <td class="w-100 h-35"><div class="m-l-5">物料代码</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ checkList.productGmp }}</div></td>
                  <td class="w-100 h-35"><div class="m-l-5">进厂批号</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ checkList.batchNum }}</div></td>
                </tr>
                <tr>
                	<td class="w-100 h-35"><div class="m-l-5">包装规格</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ checkList.productPackSpec }}</div></td>
                  <td class="w-100 h-35"><div class="m-l-5">件&nbsp;&nbsp;数</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ yfbList.grossPiece }} 件</div></td>
                  <td class="w-100 h-35"><div class="m-l-5">接收数量</div></td>
                  <td class="w-200 h-35"><div class="m-l-5">{{ number2Filter(yfbList.grossQuantity,yfbList.grossUnitName) }}</div></td>
                </tr>
              </table>
              <table border="1" style="border-top: none">
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">供应商物料名称</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.originalProductName }}</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">原厂物料代码/批号</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.originalBatch }}</div></td>
                </tr>
                <tr>
                  <template v-if="yfbList.validityDate != null && yfbList.validityDate != ''">
                    <td class="w-225 h-35"><div class="m-l-5">物料有效期</div></td>
                    <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.validityDate | showTime(yfbList.selectDateUnit) }}</div></td>
                  </template>
                	<template v-else>
                	  <td class="w-225 h-35"><div class="m-l-5">物料复验期至</div></td>
                	  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.reinspectDate | showTime(yfbList.selectDateUnit) }}</div></td>
                	</template>
                  <td class="w-225 h-35"><div class="m-l-5">经批准的供应商</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isSupplierAuthorized == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isSupplierAuthorized == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">生产企业</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.manufacturerName }}</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">生产日期</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.productionDate | showTime(yfbList.productionDateUnit) }}</div></td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">供应商</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.supplierName }}</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">送货单和采购订单数量</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.deliveryAndBuyQuantity + yfbList.deliveryAndBuyUnitName }}</div></td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">批准文号/注册证号</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ yfbList.approvalNum }}</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">备注</div></td>
                  <td class="w-225 h-35"><div class="m-l-5">{{ checkList.remark }}</div></td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">包装容器</div></td>
                  <td colspan="3" class="w-225 h-35">
                    <div class="m-l-5">
                      金属桶<div class="select-box m-r-30"><img v-if="yfbList.packContainerName == '金属桶'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      塑料桶<div class="select-box m-r-30"><img v-if="yfbList.packContainerName == '塑料桶'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      纸板桶<div class="select-box m-r-30"><img v-if="yfbList.packContainerName == '纸板桶'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      纸箱<div class="select-box m-r-30"><img v-if="yfbList.packContainerName == '纸箱'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      其他<div class="select-box"><img v-if="yfbList.packContainerName == '其他'" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td colspan="4" class="w-225 h-35">
                    <div class="m-l-5">
                      请验目的：
                      进厂检验<div class="select-box m-r-30"><img v-if="yfbList.checkPurposeName == '进厂检验'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      复验<div class="select-box m-r-30"><img v-if="yfbList.checkPurposeName == '复验'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      接近有效期<div class="select-box m-r-30"><img v-if="yfbList.checkPurposeName == '接近有效期'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      接近有效期<div class="select-box m-r-30"><img v-if="yfbList.checkPurposeName == '退货'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      接近有效期<div class="select-box m-r-30"><img v-if="yfbList.checkPurposeName == '抽检'" style="display: block" src="@/assets/img/benefits.png" /></div>
                      其他<div class="select-box"><img v-if="yfbList.checkPurposeName == '其他'" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td colspan="3" class="w-225 h-35"><div class="m-l-5">接收数量与送货单和采购订单相符</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isGetQuantityEqDeliveryAndBuy == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isGetQuantityEqDeliveryAndBuy == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td colspan="3" class="w-225 h-35"><div class="m-l-5">每批物料均有合格检验报告书</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.haveReport == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.haveReport == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td colspan="3" class="w-225 h-35">
                    <div class="m-l-5">
                      需冷藏/冷冻储存的物料运输温度是否符合要求
                    </div>
                  </td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isConformFreeze == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isConformFreeze == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td colspan="3" class="w-225 h-35"><div class="m-l-5">冷链物料运转时间</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      {{ yfbList.isConformFreeze == 1 ? '无' : (yfbList.runningTimeStart + ' - ' + yfbList.runningTimeEnd) }}
                    </div>
                  </td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">有温湿度记录仪器</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.haveRecordTAndH == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.haveRecordTAndH == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                  <td class="w-225 h-35"><div class="m-l-5">放置位置正确</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isPlaceOk == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isPlaceOk == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td class="w-225 h-35"><div class="m-l-5">物料为同一批次</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isSameBatch == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isSameBatch == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                  <td class="w-225 h-35"><div class="m-l-5">防窃取装置完好</div></td>
                  <td class="w-225 h-35">
                    <div class="m-l-5">
                      是<div class="select-box m-r-70"><img v-if="yfbList.isPreventTheftOk == 0" style="display: block" src="@/assets/img/benefits.png" /></div>
                      否<div class="select-box"><img v-if="yfbList.isPreventTheftOk == 1" style="display: block" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
              </table>
              <table border="1">
                <tr>
                  <td colspan="2" class="h-35"><div class="m-l-5">附：<div style="margin-top: -28px" class="text-center">接收（初检）记录</div></div></td>
                </tr>
                <tr>
                  <td class="w-450">
                    <div class="m-l-5 h-255">
                      随货文件：
                      <div>
                        <div style="width: 50%;display: inline-block;">
                          厂家检验报告单<div class="select-box"><img v-if="followFileNames.indexOf('厂家检验报告单') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          送货单<div class="select-box"><img v-if="followFileNames.indexOf('送货单') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          到货通知<div class="select-box"><img v-if="followFileNames.indexOf('到货通知') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          装箱单<div class="select-box"><img v-if="followFileNames.indexOf('装箱单') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          运输记录<div class="select-box"><img v-if="followFileNames.indexOf('运输记录') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                        </div>
                        <div style="display: inline-block;position: absolute;">
                          合格证<div class="select-box"><img v-if="followFileNames.indexOf('合格证') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          随货同行文件<div class="select-box"><img v-if="followFileNames.indexOf('随货同行文件') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          品质证明书<div class="select-box"><img v-if="followFileNames.indexOf('品质证明书') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          标签<div class="select-box"><img v-if="followFileNames.indexOf('标签') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                          温湿度记录仪数据<div class="select-box"><img v-if="followFileNames.indexOf('温湿度记录仪数据') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                        </div>
                      </div>
                    </div>
                  </td>
                  <td class="w-450">
                    <div class="m-l-5 h-255">
                      包装状况：
                      <div>
                        <div style="width: 60%;display: inline-block;">
                          <div>外包装清洁无破损</div>
                          <div>标识清晰</div>
                          <div>实物批号与报告书批号一致</div>
                          <div>物料在有效期内</div>
                          <div>数量与交接单一致</div>
                        </div>
                        <div style="display: inline-block;position: absolute;">
                          是<div class="select-box m-r-30"><img v-if="packStatusNames.indexOf('外包装清洁无破损') > -1" style="display: block" src="@/assets/img/benefits.png" /></div>
                          否<div class="select-box"><img v-if="packStatusNames.indexOf('外包装清洁无破损') == -1" style="display: block" src="@/assets/img/benefits.png" /></div></br>
                          是<div class="select-box m-r-30"><img v-if="packStatusNames.indexOf('标识清晰') > -1" style="display: block" src="@/assets/img/benefits.png" /></div>
                          否<div class="select-box"><img v-if="packStatusNames.indexOf('标识清晰') == -1" style="display: block" src="@/assets/img/benefits.png" /></div></br>
                          是<div class="select-box m-r-30"><img v-if="packStatusNames.indexOf('实物批号与报告书批号一致') > -1" style="display: block" src="@/assets/img/benefits.png" /></div>
                          否<div class="select-box"><img v-if="packStatusNames.indexOf('实物批号与报告书批号一致') == -1" style="display: block" src="@/assets/img/benefits.png" /></div></br>
                          是<div class="select-box m-r-30"><img v-if="packStatusNames.indexOf('物料在有效期内') > -1" style="display: block" src="@/assets/img/benefits.png" /></div>
                          否<div class="select-box"><img v-if="packStatusNames.indexOf('物料在有效期内') == -1" style="display: block" src="@/assets/img/benefits.png" /></div></br>
                          是<div class="select-box m-r-30"><img v-if="packStatusNames.indexOf('数量与交接单一致') > -1" style="display: block" src="@/assets/img/benefits.png" /></div>
                          否<div class="select-box"><img v-if="packStatusNames.indexOf('数量与交接单一致') == -1" style="display: block" src="@/assets/img/benefits.png" /></div></br>
                        </div>
                      </div>
                      <div>
                        如包装异常，请选择或注明情况，必要时附照片。
                        <div>
                          <div style="width: 27%;display: inline-block;">
                            包装破损<div class="select-box"><img v-if="packExceptionNames.indexOf('包装破损') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                            包装受潮<div class="select-box"><img v-if="packExceptionNames.indexOf('包装受潮') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                          </div>
                          <div style="display: inline-block;position: absolute;">
                            渗漏<div class="select-box"><img v-if="packExceptionNames.indexOf('渗漏') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                            水渍<div class="select-box"><img v-if="packExceptionNames.indexOf('水渍') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                          </div>
                          <div style="display: inline-block;margin-left: 80px;position: absolute;">
                            封签破损<div class="select-box"><img v-if="packExceptionNames.indexOf('封签破损') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                            霉变<div class="select-box"><img v-if="packExceptionNames.indexOf('霉变') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                          </div>
                          <div style="display: inline-block;margin-left: 200px;position: absolute;">
                            虫蛀<div class="select-box"><img v-if="packExceptionNames.indexOf('虫蛀') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div></br>
                            其他<div class="select-box"><img v-if="packExceptionNames.indexOf('其他') > -1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </td>
                </tr>
                <tr>
                	<td colspan="2" class="h-35">
                    <div class="m-l-5">
                      初检结论:
                      符合规定<div class="select-box m-r-20"><img v-if="yfbList.firstVerdict == 0" style="display: block;" src="@/assets/img/benefits.png" /></div>
                      不符合规定<div class="select-box m-r-20"><img v-if="yfbList.firstVerdict == 1" style="display: block;" src="@/assets/img/benefits.png" /></div>
                      符合规定的数量为{{ yfbList.firstVerdict == 2 ? (yfbList.productConformQuantity + yfbList.grossUnitName) : ' ' }}，不符合规定的数量为{{ yfbList.firstVerdict == 2 ? (yfbList.productNotConformQuantity + yfbList.grossUnitName) : ' ' }}。<div class="select-box"><img v-if="yfbList.firstVerdict == 2" style="display: block;" src="@/assets/img/benefits.png" /></div>
                    </div>
                  </td>
                </tr>
                <tr>
                  <td class="w-450 h-35">
                    <div class="m-l-5">物料进厂日期：{{ yfbList.comeDate | showTime }}</div>
                  </td>
                  <td class="w-450 h-35">
                    <div class="m-l-5">物料接收人：</div>
                  </td>
                </tr>
                <tr>
                  <td class="w-450 h-35">
                    <div class="m-l-5">请检部门：{{ checkList.registCheckDepartmentName }}</div>
                  </td>
                  <td class="w-450 h-35">
                    <div class="m-l-5">请检日期：{{ checkList.registCheckDate | showTime }}</div>
                  </td>
                </tr>
                <tr>
                  <td class="w-450 h-35">
                    <div class="m-l-5">请检人：</div>
                  </td>
                  <td class="w-450 h-35">
                    <div class="m-l-5">取样QA/日期：</div>
                  </td>
                </tr>
              </table>
              <div style="margin-top: 10px;">
                注：库管员应在根据验收情况在相应选项“<div class="select-box" />”内用“<img style="display: inline-block;" src="@/assets/img/benefits.png" />”表示。</div>
              </div>
              <div style="float: right;margin-top: 15px;">2021.06.18生效</div>
              <div class="page-foot text-center">
                <div class="copyright-box">
                  <div style="font-family: arial">
                    This document is strictly confidential.Any use and copy unauthorized by CHENGDU BRILLIANT PHARMACEUTICAL <b><i>is forbidden.</i></b>
                  </div>
                  <div>
                    本文件仅限成都倍特药业股份有限公司内部使用，严禁任何无授权使用、泄露或复印，违者必究。
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
	</div>
</template>

<script>
  import {
    getCheckInfo,
    getCurrentVersion,
    getFollowFileList,
    getPackStatusList,
    getPackExceptionList
  } from '@/api/check'
  import { CODE_OK } from '@/common/js/config'
  import { isBlank,parseTime } from '@/common/js/utils'
	export default {
    data() {
      return {
        isCurrentVersion: false,
        visible: false,
        checkList: {},
        yfbList: {},
        followFileNames: [],
        packStatusNames: [],
        packExceptionNames: []
      }
    },
    props: ["childDataForm"],
    created() {
      if (!isBlank(this.childDataForm)) {
        this.checkList = this.childDataForm
        this.getData()
        this.visible = true
      }
    },
    methods: {
      getData() {
        const params = {
          content: 'yfb',
          checkId: this.checkList.checkId
        }
        getCheckInfo(params).then(res => {
          if (res.code === CODE_OK) {
          	this.yfbList = res.info.yfbList
            this.idsToNames()
          }else{
          	this.$message.error(res.msg)
          }
        })
        const params2 = {
          checkTypeId: this.checkList.checkTypeId,
          printClassify: '请验单'
        }
        getCurrentVersion(params2).then(res => {
          if (res.code === CODE_OK) {
            this.isCurrentVersion = res.version.versionNum == this.checkList.printCheckVersion
          }else{
          	this.$message.error(res.msg)
          }
        })
      },
      number2Filter(number,unit) {
        //过滤
        if (isBlank(number)) return
        number = number + ''
        if (unit == 'kg' || unit == 'g') {
          if (number.indexOf('.') == -1) {
            return number + '.00' + unit
          }else{
            //小数点后只有一位，加0
            if (number.substring(number.indexOf('.')+1).length == 1) {
              return number + '0' + unit
            }else{
              return number + unit
            }
          }
        }else{
          return number + unit
        }
      },
      idsToNames() {
        const params = {
          checkTypeId: this.checkList.checkTypeId,
          printVersion: this.checkList.printCheckVersion
        }
        if (!isBlank(this.yfbList.followFileIds)) {
          getFollowFileList(params).then(res => {
            if (res.code === CODE_OK) {
              let followFileIds = this.yfbList.followFileIds.split(',')
              let followFileList = res.list
              for (let id of followFileIds) {
                for (let f of followFileList) {
                  if (id == f.followFileId) {
                    this.followFileNames.push(f.followFileName)
                    break
                  }
                }
              }
            }else{
              this.$message.error(res.msg)
            }
          })
        }
        if (!isBlank(this.yfbList.packStatusIds)) {
          getPackStatusList(params).then(res => {
            if (res.code === CODE_OK) {
              let packStatusIds = this.yfbList.packStatusIds.split(',')
              let packStatusList = res.list
              for (let id of packStatusIds) {
                for (let p of packStatusList) {
                  if (id == p.packStatusId) {
                    this.packStatusNames.push(p.packStatusName)
                    break
                  }
                }
              }
            }else{
              this.$message.error(res.msg)
            }
          })
        }
        if (!isBlank(this.yfbList.packExceptionIds)) {
          getPackExceptionList(params).then(res => {
            if (res.code === CODE_OK) {
              let packExceptionIds = this.yfbList.packExceptionIds.split(',')
              let packExceptionList = res.list
              for (let id of packExceptionIds) {
                for (let p of packExceptionList) {
                  if (id == p.packExceptionId) {
                    this.packExceptionNames.push(p.packExceptionName)
                    break
                  }
                }
              }
            }else{
              this.$message.error(res.msg)
            }
          })
        }
      },
      close() {
        this.visible = false
        this.$emit('close')
      }
    }
	}
</script>

<style type="text/scss" lang="scss" scoped>
  .check-container{
    color: black;
    background-color: #fff;
    font-family: SimSun;
    font-size: 20px;
    width: 960px;
    height: 1480px;
    padding: 15px;
    .watermark{
      position: absolute;
      margin-top: 250px;
      .watermark-img{
        width: 960px;
      }
    }
    .content{
      position: relative;
      .check-box{
        width: 900px;
        height: 1400px;
        margin: 0 15px;
        .page-header1{
          height: 130px;
        }
        .page-main{
          margin-top: 20px;
          .first-col{
            border-top:0;
            border-right:0;
            border-bottom:0;
            border-left:0;
          }
          .one-col{
            border-top:0;
            border-right:0;
            border-bottom:0;
            border-left:1px solid black;
          }
        }
        .page-foot{
          border-top: 1.5px solid black;
          font-size: 13px;
          width: 900px;
          bottom: 15px;
          position: absolute;
          height: 40px;
          .copyright-box{
            width: 100%;
            bottom: 0;
            position: absolute;
          }
        }
      }
    }
    .select-box{
      display: inline-block;
      width: 15px;
      height: 15px;
      border: 1px solid black;
    }
    .w-450{
      width: 450px;
    }
    .w-225{
      width: 225px;
    }
    .w-100{
      width: 100px;
    }
    .w-200{
      width: 200px;
    }
    .h-255{
      height: 255px;
    }
    .h-100{
      height: 100px;
    }
    .h-30{
      height: 30px;
    }
    .h-35{
      height: 35px;
    }
    .m-l-5{
      margin-left: 5px;
    }
    .m-l-20{
      margin-left: 20px;
    }
    .m-r-70{
      margin-right: 70px;
    }
    .m-r-30{
      margin-right: 30px;
    }
    .m-r-20{
      margin-right: 20px;
    }
  }
</style>
